<template>
	<view class='hui b_width'>
		
		<view class='body_box'>
			<u-radio-group
			    v-model="check"
			    placement="column"
			  >
			<view v-if='!show' class='tc_box' v-for="item in list" :key="item.id" >
				<view @click="checkAddress(item)">
				<view class="b_flex_c_s">
					<view class='name'>{{item.realName}}</view>
					<view class='mobile'>{{item.phone}}</view>
				</view>
				<view class="site">{{item.province}}{{item.city}}{{item.district}} {{item.detail}}</view>
				</view>
				<view class="flex_center bottom_box">
					    <u-radio
					      label="设置默认地址"
						  labelSize="13px"
					      :name="item.id"
					      @change="radioChange"
						  activeColor="#FF4E1B"
					    >
					    </u-radio>
						<view class="flex">
							<view class="boxs" @click="$project.toPath('/pages/address/info?id='+item.id)">编辑</view>
							<view class="boxs" @click="del(item)">删除</view>
						</view>
				</view>
			</view>
			  </u-radio-group>
		</view>
		<view class='add_box' @click="$project.toPath('/pages/address/info')">添加地址</view>
		<empty v-if="show" text='暂无地址'></empty>
	</view>
</template>

<script>
	import empty from '@/components/empty.vue';
	import {addressList,addressSet,addressDel} from '@/require/api.js';
	export default {
		components: {
			empty
		},
		data() {
			return {
               list:[],
			   params:{page:1,limit:99999},
			   total:'',
			   check:0,
			   type:1,
			   show:false
			};
		},
		onLoad(data) {
			if(data.type){
				this.type=data.type;
			}
		},
		onShow() {
			this.getList();
		},
		methods:{
			checkAddress(item){
			   if(this.type==2){
				   getApp().globalData.address=item;
				   this.$project.toBack();
			   }	
			},
		   async getList(){
			 let{data}=await addressList(this.params);
			 this.list=data.list;
			 this.total=data.total;
			 this.setShow();
			 if(data.list.length>0&&data.list[0].isDefault) this.check=data.list[0].id;
			},
			async radioChange(name){
			    await addressSet({id:name});
				this.getList();
			
			},
			async del(item){
				let _=this;
				uni.showModal({
					title: '确定要删除地址吗?',
					success(res) {
						if (res.confirm) {
							_.setDel(item);
						}
					}
				})
			},
			async setDel(item){
			let {code,message}=await addressDel({id:item.id});
			if(code==200){
				this.$project.toast(message);
				this.getList();
				this.delAddressCache(item.id);
			}
			},
			setShow() {
				if (this.list.length > 0) {
					this.show = false;
				} else {
					this.show = true;
				}
			},
			delAddressCache(id){
				let address=getApp().globalData.address;
				if(address.id==id) getApp().globalData.address={id:''};
			}
		}
	}
</script>

<style lang="scss" scoped>
.body_box{
	box-sizing: border-box;
	padding: 20rpx 20rpx 60rpx 20rpx;
	font-size: 26rpx;
}
.tc_box{
	background: #fff;
	border-radius: 15rpx;
	box-sizing: border-box;
	padding: 15rpx 60rpx;
	margin-bottom: 30rpx;
	.name{
		font-weight: bold;
		font-size: 30rpx;
	}
	.mobile{
		
		font-size: 28rpx;
		margin-left: 10rpx;
	}
	.site{
		box-sizing: border-box;
		padding: 15rpx 0 20rpx 0;
		border-bottom: 1rpx solid #eeeeee;
		word-break: break-all;
		font-size: 28rpx;
	}
}
.add_box{
	background: #FF4E1B;
	color: #fff;
	text-align: center;
	border-radius: 25rpx;
	height: 85rpx;
	line-height: 85rpx;
	width: 90%;
	margin: 0 5%;
	position: fixed;
	bottom: 50rpx;
}
.flex{
	display: flex;
	align-items: center;
}
.flex_center{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.bottom_box{
	box-sizing: border-box;
	padding: 15rpx 0 0 0;
}
.boxs {
      height: 50;
      width: 90rpx;
      border-radius: 25rpx;
      text-align: center;
      line-height: 50rpx;
      color: #fff;
      background: #FF4E1B;
	  margin-left: 10rpx;
    }
</style>
